<template>
	<header>
		<span class="fa fa-angle-left" v-if='showback' @click='back'></span>
		{{text}}
	</header>
</template>

<script>
	export default {
		props:{
			text:String,
			showback:{
				type:Boolean,
				default:true
			}
		},
		methods:{
			back(){
				this.$router.back();
			}
		}
	}
</script>

<style lang='scss' scoped="">
	@import "../assets/style/_mixin";
	header {
		width: 100%;
		height: 80px/$ppr;
		font-size: 32px/$ppr;
		text-align: center;
		background: #2c80c3;
		color: #fff;
		line-height: 80px/$ppr;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		z-index: 9;
		max-width: 750px;
		margin: auto;
		span {
				position: absolute;
				left: 20px/$ppr;
				@include transtop;
				font-size: 48px/$ppr;
			}
	}
</style>